{extend name="layout" /}
{block name='content'}

<div class="row">
    <div class="col-12 no-pad-both">
        <div class="card">
            <div class="card-header">
                <div class="btn-group btn-group-sm">
                    <button id="ch_add" class="btn  btn-outline-primary">新增</button>
                    <button id="ch_del" class="btn  btn-outline-danger">删除</button>
                </div>
                <div class="card-tools">

                    <div class="input-group input-group-sm" style="width: 150px;">
                        <input type="text" name="table_search" class="form-control float-right" placeholder="Search">

                        <div class="input-group-append">
                            <button type="submit" class="btn btn-default"><i class="fa fa-search"></i></button>
                        </div>
                    </div>
                </div>
            </div>
            <!-- /.card-header -->
            <div class="card-body p-0 tree-list">
                <ul class="tree-group">{$li|raw}</ul>
            </div>
            <!-- /.card-body -->
            <div class="card-footer clearfix">

            </div>
        </div>
        <!-- /.card -->
    </div>
</div>
{/block}

{block name='pagejs'}
<script>
    $(function () {
        // 添加
        $('#ch_add').on('click', function ( event ) {
            var data = { 'id': 0, 'parent_id': 0 };
            layer.open({
                type: 2,
                title: '新增',
                shadeClose: false,
                shade: 0.8,
                area: ['40%', '85%'],
                content: "{:url('admin/menu/add')}?id="+data.id+"&parent_id="+data.parent_id,
                success: function (layero, index) {
                    // pageJs(layero, index);
                }
            });
        });

        // 操作
        $(".oper").on('click', function ( event ) {
            var tree_title = $(this).parents('.tree-title'),
                id = tree_title.attr('id'),
                pid = tree_title.data('pid'),
                subData = { 'id': id, 'parent_id': pid };

            // 增加
            if ( $(this).hasClass('oper-add') ) {
                operation('add', subData);
            }

            // 修改
            if ( $(this).hasClass('oper-edit') ) {
                operation('edit', subData);
            }

            // 禁用
            if ( $(this).hasClass('oper-disabled') ) {
                layer.confirm('确定要执行操作吗？', function(index) {
                    operation('disabled', subData);
                    layer.close(index);
                });
            }

            // 删除
            if ( $(this).hasClass('oper-del') ) {
                layer.confirm('确定要执行操作吗？', function(index) {
                    operation('del', subData);
                    layer.close(index);
                });
            }

            // popupBox( getMsgBox( '操作出现问题了', 'danger' ) );
        });
    });

    function operation(oper_type, data) {
        $.post("{:url('admin/menu/"+oper_type+"')}", data, function( response ){
            if ( response.hasOwnProperty('error_code') ) {
                var code = parseInt( response.error_code );
                switch (code) {
                    case 1:
                        popupBox( getMsgBox( {'success':response.msg}, 'success' ), function (alert_layero, alert_index) {
                            setTimeout(function () {
                                layer.close( alert_index )
                            }, 600);
                        } );
                        location.reload();
                        break;
                    case 10000:
                        popupBox( getMsgBox( response.msg, 'danger' ) );
                        break;
                    default:
                        popupBox( getMsgBox( {msg:'操作出现问题了'}, 'danger' ) );
                }
            } else {
                layer.open({
                    type: 2,
                    title: 'test',
                    shadeClose: false,
                    shade: 0.8,
                    area: ['40%', '85%'],
                    content: "{:url('admin/menu/"+oper_type+"')}?id="+data.id+"&parent_id="+data.parent_id,
                    success: function (layero, index) {
                        // pageJs(layero, index, data );
                    }
                });
            }
        });
    }
</script>
{/block}